<template>
  <div v-loading="vloading">
    <el-row style="background-color: #eee;">
      <el-col :span="12" :offset='2' style="background-color: #eee;">
        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm ">
          <el-form-item label="使用模版">
            <span>模版：信息报送成功通知</span>
          </el-form-item>
          <el-form-item label="消息标题" prop="name">
            <el-input type="text" v-model="ruleForm.name" placeholder="填写消息标题">
              ></el-input>
          </el-form-item>
          <el-form-item label="报送单位" prop="unit">
            <el-input type="text" v-model="ruleForm.unit" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="消息类型" prop="type">
            <el-input type="text" v-model="ruleForm.type"></el-input>
          </el-form-item>
          <el-form-item label="时间" prop="time">
            <el-date-picker v-model="ruleForm.time" format="yyyy 年 MM 月 dd 日"
      value-format="yyyy-MM-dd" type="date" placeholder="选择日期">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="发送️内容" prop="context">
            <el-col>
              <el-input type="textarea" v-model="ruleForm.context" :rows="6" placeholder="请输入消息内容"></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="跳转链接" prop="url">
            <el-input type="text" v-model="ruleForm.url" placeholder="例:https://www.baidu.com"></el-input>
          </el-form-item>
          <el-form-item label="消息备注" prop="remark">
            <el-input type="text" v-model="ruleForm.remark"></el-input>
          </el-form-item <el-form-item>
          <el-button type="primary" @click="submitForm('ruleForm')">开始群发</el-button>
          <el-button @click="resetForm('ruleForm')">重置</el-button>
          </el-form-item>
        </el-form>
      </el-col>

      <!-- <el-col :span="12" >
        <el-form>
            <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')"
                  >开始群发</el-button
                >
                <el-button @click="resetForm('ruleForm')">重置</el-button>
              </el-form-item>
            </el-form>
      </el-col> -->
    </el-row>
  </div>
</template>
<script>
  import {
    getToken,
    saveMessage,
    pushMessage
  } from "@/api/user/user.js";
  export default {
    data() {
      var checkoldpass = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入原密码"));
        } else {
          callback();
        }
      };
      var validatePass = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入密码"));
        } else {
          if (this.ruleForm.checkPass !== "") {
            this.$refs.ruleForm.validateField("checkPass");
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请再次输入密码"));
        } else if (value !== this.ruleForm.pass) {
          callback(new Error("两次输入密码不一致!"));
        } else {
          callback();
        }
      };
      return {
        vloading: false,
        ruleForm: {
          name: "",
          context: '',
          remark: "",
          time: '',
          type: '通知信息',
          unit: '',
          url: "",
        },
        token: '',
        rules: {
          oldpass: [{
            validator: checkoldpass,
            trigger: "blur"
          }],
          pass: [{
            validator: validatePass,
            trigger: "blur"
          }],
          checkPass: [{
            validator: validatePass2,
            trigger: "blur"
          }],
        },
      };
    },
    created() {
      const admin = JSON.parse(sessionStorage.getItem('admin'));
      console.log('admin:',admin);
      this.ruleForm.unit = admin.name
    },
    methods: {
      submitForm(formName) {
        console.log('开始群发：', formName);
        const admin = JSON.parse(sessionStorage.getItem('admin'));
        console.log('admin:',admin);
        let that = this;
        if (that.ruleForm.name != '' && that.ruleForm.context != '' && that.ruleForm.time != '') {
          let data = {
            template: '消息报送通知',
            o_id: admin.o_id,
            title: that.ruleForm.name,
            url: that.ruleForm.url,
            context: that.ruleForm.context,
            remark: that.ruleForm.remark,
            push_time: that.ruleForm.time,
            type: that.ruleForm.type,
            address: that.ruleForm.unit,
          }
          console.log('保存消息：',data);
          saveMessage(data).then(res=>{
            console.log('保存成功',res.id);

            that.ruleForm.url = "https://sh.funcnum.com/h5/#/onepage?id="+res.id

            console.log('url',that.ruleForm.url);
            getToken({app_id:admin.app_id}).then((res) => {
               console.log('请求成功：', res);
               that.token = res.access_token
               this.vloading = true;
                 pushMessage({
                   app_id:admin.app_id,
                   token:that.token,
                   name: that.ruleForm.name,
                   remark: that.ruleForm.remark,
                   url: that.ruleForm.url,
                   context: that.ruleForm.context,
                   remark: that.ruleForm.remark,
                   time: that.ruleForm.time,
                   type: '通知信息',
                   unit: that.ruleForm.unit,
                 }).then(res=>{
                   that.$message({
                     message: "发送成功！",
                     type: "success",
                   });
                    that.resetForm("ruleForm")
                     this.vloading = false;
                 })
                })
          })

        } else {
          that.$message({
            message: "不能为空！",
            type: "error",
          });
          this.vloading = false;
        }






      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
    },
  };
</script>

<style scoped>
</style>
